<template>
  <fragment>
    <div class="legends">
      <div
        class="unit"
        :class="{unit_hori_top: arrayStyle === 'horizontal' && numPosition_hori === 'top'}"
      >单位:mm</div>
      <fragment v-for="(item, i) of datalist" :key="i">
        <Legend :listData="item"></Legend>
      </fragment>
    </div>
  </fragment>
</template>

<script>
import { mapState, mapGetters } from "vuex";
import Legend from "./Legend";

export default {
  components: {
    Legend
  },
  data: () => {
    return {};
  },
  mounted() {
    // console.log(this);
  },
  methods: {
    render() {}
  },
  computed: {
    ...mapState([
      "numStyle",
      "arrayStyle",
      "numPosition_vert",
      "numPosition_hori",
      "width",
      "height"
    ]),
    ...mapGetters(["datalist"]),
    activeList() {
      return this.arrayStyle === "vertical" ? this.list.reverse() : this.list;
    }
  }
};
</script>

<style>
.legends {
  display: inline-block;
}
.unit {
  font-family: MicrosoftYaHei;
  font-size: 13px;
  font-weight: normal;
  font-stretch: normal;
  letter-spacing: 0px;
  color: #000000;
  margin-bottom: 10px;
}
.unit_hori_top {
  margin-bottom: 29px;
}
</style>